<template>
    <section>
      <p style="text-align: center;line-height:100px;font-size: 14px;font-weight: bold;color: gray;">请上传认证资料</p>
      <!-------------医生照片-->
      <div class="photo">
        <cube-upload
          ref="upload"
          :auto="ifUpload"
          :action="action"
          :max="1"
          :simultaneous-uploads="1"
          @file-removed = "filesRemoved"
          @file-submitted="fileSubmitted" />
      </div>
      <p class="text">
        <span>认证说明：</span>
        <span>1、医生认证请提供所属医院工牌照片</span>
      </p>
      <p class="next" @click="next">提交认证</p>
    </section>
</template>

<script>
  import axios from 'axios'
  import qs from 'qs'
  import { Toast } from 'mint-ui';
  import {updateDoctorProfile} from "../../api/api"
    export default {
        props: [],
        name: 'app',
        data(){
            return {
              ifUpload:false,
              reportDateTime: "请选择日期",
              resultUrl:"",
              action: {
                target: '//jsonplaceholder.typicode.com/photos/',
                prop: 'base64Value'
              }
            }
        },
        computed: {},
        components: {},
        created(){
        },
        methods: {
          filesRemoved(){
            this.resultUrl="";
          },
          fileSubmitted: function (file) {
            console.log('图片列表====>', this.$refs.upload.files);
            let formData = new FormData();
            formData.append('file', this.$refs.upload.files[0].file);
            formData.append('name', "file");
            formData.append('filename', "2.jpg");
            formData.append('Content-Type', "image/jpg");
            formData.append('Content-Disposition', "form-data");
            let config = {
              headers: {
                'Content-Type': 'multipart/form-data;boundary = '
              }
            }
            axios.post('http://www.bestckd.com/lungtest/api/remote/upload', formData, config).then(res=>{
              console.log(res);
              this.resultUrl=res.data.Result;
            })



          },
          next(){
                if(this.resultUrl){
                    let params={
                      Id:JSON.parse(localStorage.getItem("user")).Id,
                      HospitalName:JSON.parse(localStorage.getItem("info")).HospitalName,
                      Name:JSON.parse(localStorage.getItem("info")).Name,
                      JobTitle:JSON.parse(localStorage.getItem("info")).JobTitle,
                      GoodATCancer:localStorage.getItem("GoodATCancer"),
                      Gender:JSON.parse(localStorage.getItem("info")).Gender,
                      AvatarUrl:JSON.parse(localStorage.getItem("info")).AvatarUrl,
                      CertifiedUrl:this.resultUrl
                    };
                  updateDoctorProfile(params).then(res=>{
                      console.log(res);
                      this.$router.push("/mine");
                  });
                }
                else{
                  Toast({
                    message: '填写完整信息',
                    position: 'middle',
                    duration: 1000
                  });
                }
          }
        },
        mounted() {
            console.log(localStorage.getItem("CertifiedUrl"));
          if(localStorage.getItem("CertifiedUrl")){
            this.resultUrl=localStorage.getItem("CertifiedUrl");
            var img={
              url:this.$photoUrl+localStorage.getItem("CertifiedUrl")
            };
            this.$refs.upload.files.push(img);
            }
        },
        destroyed(){
        }
    }
</script>

<style lang="scss" scoped>
  section{
    background-color: white;
  }
  .text{
    width: 80%;
    margin: 0 auto;
    margin-top: 50px;
    span{
      display: inline-block;
      width: 100%;
      text-align: left;
      line-height: 30px;
      font-size: 12px;
    }
  }
  .photo{
    width: 80px;
    height: 80px;
    background-color: aliceblue;
    margin: 0 auto;
  }
  .next{
    width: 90%;
    height: 40px;
    position: fixed;
    bottom:40px;
    left:5%;
    border-radius: 5px;
    color: white;
    text-align: center;
    line-height: 45px;
    letter-spacing: 3px;
    background-color: rgba(0, 146, 252, 0.5);
  }
</style>
